import React from 'react'
import '../css/home.css'
import {
  HashRouter,
  Switch,
  Route,
  Link
} from 'react-router-dom'

import About from "../index/About"


class Home extends React.Component{
    constructor(props){
      super();
      this.state={
        list:[
          {
          title:'小米手机'
        },
        {
          title:'Redmi 红米'
        },
        {
          title:'电视'
        },
        {
          title:'笔记本'
        },
        {
          title:'家电'
        },
        {
          title:'路由器'
        },
        {
          title:'智能硬件'
        },
        {
          title:'服务'
        }
      ],
      }

      
  
    }
    
  
    render(){
   
      return(
        <div>
          <HashRouter>

            <div className="header-bottom" onClick={
              ()=>{
                this.props.history.push('/Denglu')
              }
            }>登录</div>




          <div className="header">
          {
            this.state.list.map((c,i)=>{
              return  <div key={i} >
                <p><Link to={
                  `/About/${c.title}`

                } >{c.title}</Link> </p>
              </div>
            })
          }



          
          </div >
          

          <div className="header-bottom">
            <Switch>
              <Route  path="/About/:title" component={About}/>

            </Switch>
      
          </div>
       
         
          </HashRouter>
        </div>
      )
    }
  
    
  
  
  
  
  }
  
  export default Home;